<!doctype html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>特价抢购</title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />		
		<link rel="stylesheet" href="../libs/mui/mui.css"/>
		<link rel="stylesheet" href="../css/mui.min.css"/>
		<link rel="stylesheet" href="../libs/iconfont/fonts/iconfont.css"/>
		<link rel="stylesheet" type="text/css" href="../css/main.css"/>		
		<style>
			.mui-content{font-size: 16px;}	
			h6{margin-top: -8px;color: black;}
			.mui-slider-indicator.mui-segmented-control{background: white;}			
			.mui-segmented-control.mui-segmented-control-inverted .mui-control-item.mui-active{color: #ff5252;}			
			.mui-slider .mui-segmented-control.mui-segmented-control-inverted~.mui-slider-group .mui-slider-item{border: none;}			
			.mui-control-item b{font-size: 16px;}
			.mui-control-item span{display: block;padding: 0;margin-top: -20px;font-size: 11px;}			
			/*图片*/
			.mui-table-view{border-top: 1px solid #efeff4;}
			.mui-table-view-cell>a:not(.mui-btn){white-space:normal}
			.mui-table-view .mui-media-object {line-height: 47px;max-width: 95px;height: 85px;}
			.mui-media-body b{color: black;font-size: 16px;padding: 5px 0;display: block;}
			.Pan b{color: red;font-size: 14px;padding-bottom: 0;}
			.Pan h5{float: right;width: 100%;text-align: right;font-size: 11px;}
			.Pan button{padding: 3px 11px;border: none;float: right;margin-top: 5px;}			
			/*红*/.mui-btn-danger{background: #ff5252;}
			/*灰*/.mui-btn-grey{background: #aaaaaa;}
			/*橘色*/.mui-btn-orange{background: #EC971F;color: white;}
			.Pan s{font-size: 12px;}
			/*进度条*/	
			#demo1{width: 100%;display: inline-block;}
			#demo1 span{width: 38%;float: left;font-size: 11px;}
			#demo1 div{width: 60%;float: right;}		
			.mui-progressbar-warning span {background-color: #ff8f8f;}
			.mui-progressbar{height: 8px;border-radius: 6px;margin: 5px 0px;display: -webkit-inline-box;}
			 
			progress::-moz-progress-bar { background: #0064B4; }
			progress::-webkit-progress-bar { background: #ffd98e; }        /*背景颜色*/
			progress::-webkit-progress-value  { background: #fdb62b; }
		</style>
	</head>
	<body>
		<header class="mui-bar mui-bar-nav">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<h1 class="mui-title">特价抢购</h1>		
		</header>
		<div class="mui-content">		
			<div class="Gradua">	
				<div id="slider" class="mui-slider">
					<div id="sliderSegmentedControl" class="mui-slider-indicator mui-segmented-control mui-segmented-control-inverted">
						<!--<a class="mui-control-item mui-active" href="#item1mobile">
							<b>09:00<span>已开抢</span></b>							
						</a>
						<a class="mui-control-item" href="#item2mobile">
							<b>12:00<span>已开抢</span></b>
						</a>
						<a class="mui-control-item" href="#item3mobile">
							<b>15:00<span>抢购中</span></b>
						</a>
						<a class="mui-control-item" href="#item4mobile">
							<b>18:00<span>即将开始</span></b>
						</a>
						<a class="mui-control-item" href="#item5mobile">
							<b>21:00<span>即将开始</span></b>
						</a>-->
					</div>			
					<div class="mui-slider-group" id="j_mui_slider_content">
						<div id="item1mobile" class="mui-slider-item mui-control-content">							
							
						</div>
						<div id="item2mobile" class="mui-slider-item mui-control-content">					
							
						</div>	
						<div id="item3mobile" class="mui-slider-item mui-control-content">
							
						</div>
						<div id="item4mobile" class="mui-slider-item mui-control-content">
							
						</div>
						<div id="item5mobile" class="mui-slider-item mui-control-content">
							
						</div>
					</div>
				</div>
			</div>	
		</div>	
		<script src="../js/mui.min.js"></script>
		<script type="text/javascript" src="../js/function.js"></script>
		<script type="text/javascript" src="../js/open.js"></script>		
		<script type="text/javascript" src="../libs/jquery/jquery.js"></script>
		<script type="text/javascript" src="../js/web_js/public.js"></script>
		<script type="text/javascript" src="../js/web_js/Special.js"></script>
		<script>
			mui.init({
				swipeBack: false
			});
			(function($) {
				$('.mui-scroll-wrapper').scroll({
					indicators: true //是否显示滚动条
				});	
			})(mui);
			//高度自适应	
			$(document).ready(function(){		
				$(".mui-control-content").css({"min-height": (document.documentElement.clientHeight-100)+"px" });	
			})
//			进度条
			mui("#demo1 .mui-progressbar").each(function () {
				mui(this).progressbar({progress:this.getAttribute("data-progress")}).show();
			});
		</script>
	</body>
</html>